<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Aplicantes</title>

<link rel="stylesheet"
	href="<%=request.getContextPath()%>/style/gen-style.css"
	type="text/css" />
<link rel="stylesheet"
	href="<%=request.getContextPath()%>/style/mkv/jquery-ui.css"
	type="text/css" />
<link rel="stylesheet"
	href="<%=request.getContextPath()%>/style/ui.jqgrid.css"
	type="text/css" />
<link rel="stylesheet"
	href="<%=request.getContextPath()%>/style/makovo-style.css"
	type="text/css" />

<script type="text/javascript"
	src="<%=request.getContextPath()%>/scripts/jquery-2.1.3.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/scripts/gen.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/scripts/inegi.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/scripts/ui/jquery.jqGrid.src.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/scripts/spin.js"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/scripts/auxiliares.js"></script>

<script type="text/javascript">
var mVal = new Gen.Validator('val');
	if (validaSesion("${sessionScope.LoginMenu}"))
		document.location = "index.jsp";
	var mPageSize = 50;
	var mTotal = 100;

	var mCurrentFilter = {
		"curp" : null,
		"state" : -1,
		"city" : -1,
		"step" : -1,
		"page" : 0,
		"change" : 1
	}
	$(document).ready(
			function() {
				if (validaSesion("${sessionScope.LoginMenu}"))
					document.location = "index.jsp";
				var mCall = new Gen.AjaxCall();
				var mApplicants;
				var mTemplate = "<table><tr><td>Domicilio:</td><td>{0}</td></tr></table>";

			
				function setHeader(p) {

					var end = p.pageSize * (mCurrentFilter.page + 1);

					mTotal = p.total;
					mPageSize = p.pageSize;

					if (end > mTotal)
						end = mTotal;

					$('#num-end').text(end);
					$('#num-init').text(p.pageSize * mCurrentFilter.page + 1);
					$('#num-total').text(p.total);
				}
				
				$('#filter').click(function() {
					mCurrentFilter.curp = null;
					mCurrentFilter.step = -1;
					mCurrentFilter.state = $('#state').val();
					mCurrentFilter.city = $('#city').val();
					mCurrentFilter.page = 0;
					mCurrentFilter.change = 1;

					getApplicants(mCurrentFilter, refreshGrid);
					mCurrentFilter.change = 0;
				});

				$('#prev').click(function() {
					if (mCurrentFilter.page <= 0)
						return;

					mCurrentFilter.curp = null;
					mCurrentFilter.step = -1;
					mCurrentFilter.state = $('#state').val();
					mCurrentFilter.city = $('#city').val();
					mCurrentFilter.page = mCurrentFilter.page - 1;
					mCurrentFilter.change = 0;

					getApplicants(mCurrentFilter, refreshGrid);
				});

				$('#next').click(function() {
					if (((mCurrentFilter.page + 1) * mPageSize) >= mTotal)
						return;

					mCurrentFilter.curp = null;
					mCurrentFilter.step = -1;
					mCurrentFilter.state = $('#state').val();
					mCurrentFilter.city = $('#city').val();
					mCurrentFilter.page = mCurrentFilter.page + 1;
					mCurrentFilter.change = 0;

					getApplicants(mCurrentFilter, refreshGrid);
				});
				
				$('#state').change(function() {
					var stateId = $(this).val();
					var state = findValue(Inegi.states, 'id', stateId);

					if (stateId != -1)
						Inegi.fillCities($('#city'), stateId, true);
				});

				$('#tblUsers').jqGrid(
						{
							datatype : "local",
							height : "auto",
							width : 1000,
							caption : "Listado de clientes",
							rowNum : 1000,
							rowList : [ 1000, 2000 ],
							colNames : [ 'CURP', 'Nombre' ],
							rowattr : function(row, rowel) {
								if (rowel.appStep == 102)
									return {
										"class" : "approved"
									};
								if (rowel.appStep == 103)
									return {
										"class" : "rejected"
									};
							},
							colModel : [ {
								name : 'curp',
								index : 'curp',
								width : 100,
								key : true
							}, {
								name : 'name',
								index : 'name',
								width : 200,
								formatter : formatterApplicant
							} ],
							subGrid : true,
							subGridRowExpanded : function(subgrid_id, row_id) {
								var row = findValue(mApplicants, "curp", row_id);
								var temp = mTemplate.format(row.address.street + " " + row.address.extNum + " "
										+ row.address.intNum + "<br/>" + row.address.state + " " + row.address.city + ", "
										+ row.address.loc + "<br/>C.P.: " + row.address.cp + " <br/>");
								$('#' + subgrid_id).append(temp);

							},
							loadComplete : function(request) {
							}
						});

				$('#export').click(function() {
					var state = $('#state').val() ;
					var city = $('#city').val();
					if(validate())
					{
						var info = "state=" + state + "&city=" + city;
						window.open('<%=request.getContextPath()%>/tareas/exportCSV.jsp?' + info);
					}
					else
						alert("");
				});

				function refreshGrid(data) {
					$('#tblUsers').jqGrid('clearGridData');
					$('#tblUsers').jqGrid('setGridParam', {
						data : data
					});
					$('#tblUsers').trigger('reloadGrid');
				}

				function formatterApplicant(cellValue, options, rowObject) {
					return rowObject.name + " " + rowObject.lastName + " " + rowObject.secondLastName;
				}

				function getApplicants(filter, afterFunction) {
					showOverlay(true);
					mCall.post('ajax/GetApplicants.action', {
						id : filter.curp,
						step : filter.step,
						state : filter.state,
						city : filter.city,
						page : filter.page,
						change : filter.change
					}, function(a) {
						mApplicants = a.applicants;
						if (afterFunction != null)
							afterFunction(mApplicants);

						setHeader(a);
						hideOverlay();
					}, function(er) {
						hideOverlay();
					});
				}

				function getUserInfo() {
					mCall.post('ajax/GetUser.action', {}, function(u) {
						var nada = u;

					}, function(er) {
					});
				}

				Inegi.fillStates($('#state'));
				getApplicants(mCurrentFilter, refreshGrid);
				getUserInfo();
			});
	function validate() {
		var errors = mVal.validate($('.divContenido'), function() {
		});

		return errors.length == 0;
	}
</script>
</head>
<body>
	<div style="width: 1100px; margin: 0 auto">
		<form action="ajax/GetUser">
			<div class="headerMK">
				<div class="logo">
					<span class="hdTitulo">Sistema para Aplicación de Subsidio
						2015</span>
				</div>
				<div
					style="font-size: 0.26em; top: -50px; position: relative; width: 500px; float: right; text-align: right; padding-right: 10px">
					<i>${sessionScope.LoginNombre}</i><b><a
						href="/makovo/paginas/index.jsp"> - Cerrar Sesión</a></b>
				</div>
			</div>
		</form>

		<div class="divContenido">
			<a href="<%=request.getContextPath()%>/paginas/menu.jsp">Regresar
				al menú</a> <br />
			<div style="padding-left: 100px">
				<div>
					<h3>Exportar listado</h3>
				</div>
				<table style="width: 100%">
					<tr>
						<td><select class="t-box" id="state" val="selected" wrongOption="-1" ></select></td>
						<td><select class="t-box" id="city" val="selected" wrongOption="-1" >
								<option value="-1">.. Seleccione una opción ..</option>
						</select></td>
						<td style="width: 20%">
							<form action="ajax/GetApplicants">
								<button type="button" id="filter" class="t-btn tiny hor-opening">Filtrar</button>
							</form>
						</td>


					</tr>
				</table>
			</div>

			<div style="width: 1000px; margin: 0px auto; padding: 2em;">
				<div style="float: right;">
					<span>Se muestran registros </span> <span id="num-init">1</span> <span>a</span>
					<span id="num-end"></span> <span>de</span> <span id="num-total"></span>
				</div>
				<br> <br>
				<table id="tblUsers">

				</table>
				<div>
					<button type="button" style="float: left;" id="prev"
						class="t-btn tiny hor-opening">Página anterior</button>
					<button type="button" style="float: right;" id="next"
						class="t-btn tiny hor-opening">Página siguiente</button>
				</div>
				<button type="button" id="export" class="t-btn tiny hor-opening" style="width: 1000px; margin: 0px auto;">Exportar
					CSV</button>
			</div>
		</div>
	</div>

</body>
</html>